<template>
  <div class="setting-container">
    <header>
      <span class="lastpage" @click="$router.go(-1)">&lt;</span>
      <span class="txt">设置</span>
    </header>
    <ul class="list">
      <li>一致性 Consistency<span>&gt;</span></li>
      <li>反馈 Feedback<span>&gt;</span></li>
      <li>效率 Eifficiency<span>&gt;</span></li>
      <li @click="updateUserInfo">更改个人信息<span>&gt;</span></li>
      <li @click="updatePwd">修改密码<span>&gt;</span></li>
      <li style="border-bottom: 1px solid #f1f3f7">切换账号与注销登录的区别<span>&gt;</span></li>
    </ul>
    <a href="javascript:;" @click="$router.push('/loginPage')">切换账号</a>
    <a @click="deleteLogin" style="border-bottom: 1px solid #f1f3f7" href="javascript:;">注销账号</a>
    <div class="footer"><span>技术支持：十月微凉 湘ICP备 19027633号</span></div>
  </div>
</template>

<script>
export default {
  data() {
    return {}
  },
  methods: {
    deleteLogin() {
      this.$store.commit('openToast')
    },
    updateUserInfo() {
      this.$store.commit('openInfoToast')
    },
    updatePwd() {
      console.log(1)
      this.$store.commit('openPwdToast')
    }
  }
}
</script>

<style lang="less" scoped>
.setting-container {
  header {
    text-align: center;
    padding: 15px 20px;
    margin-bottom: 20px;
    border-top: 1px solid #f1f3f7;
    border-bottom: 1px solid #f1f3f7;
    .lastpage {
      float: left;
      color: #2f9afb;
      font-size: 25px;
    }
    .txt {
      font-size: 18px;
    }
  }
  .list {
    padding: 10px 15px;
    margin-bottom: 10px;
    li {
      border-top: 1px solid #f1f3f7;
      padding: 20px 0;
      font-size: 14px;
      span {
        float: right;
        color: #ccc;
        margin-right: 5px;
      }
    }
  }
  a {
    display: block;
    text-align: center;
    text-decoration: none;
    font-size: 18px;
    color: #000;
    padding: 20px 0;
    border-top: 1px solid #f1f3f7;
  }
  .footer {
    width: 100%;
    position: fixed;
    bottom: 0;
    font-size: 13px;
    color: #6389fb;
    text-align: center;
    padding-bottom: 20px;
  }
}
</style>